﻿@page "/books"
@inherits SyncfusionSampleComponentBase
@using SyncfusionSample.Books
@using SyncfusionSample.Localization
@using Microsoft.Extensions.Localization
@using System.Globalization
@inject IStringLocalizer<SyncfusionSampleResource> L

<h3>Books</h3>

@if ( Loading )
{
    <span>Loading...</span>
}
else
{
    <SfButton OnClick="@OpenCreateBookModalAsync" IsPrimary="true">New Book</SfButton>

    <SfGrid DataSource="@BookList" AllowPaging="true">
        <GridPageSettings PageSizes="true" PageSize="10"></GridPageSettings>
        <GridColumns>
            <GridColumn Field="@nameof( BookDto.Name )" HeaderText="Name" />
            <GridColumn Field="@nameof( BookDto.Price )" HeaderText="Price" />
            <GridColumn Field="@nameof( BookDto.PublishDate )" HeaderText="Publish Date" />
            <GridColumn Width="200px">
                <Template>
                    <SfButton OnClick="@(()=>OpenEditingBookModalAsync(context as BookDto))">Edit</SfButton>
                    <SfButton OnClick="@(()=>DeleteBookAsync(context as BookDto))">Delete</SfButton>
                </Template>
            </GridColumn>
        </GridColumns>
    </SfGrid>

    <SfDialog @bind-Visible="@NewDialogOpen" Width="500px">
        <DialogTemplates>
            <Header>New book</Header>
            <Content>
                <SfTextBox @bind-Value="@NewBookDto.Name" Placeholder='Book Name' FloatLabelType='FloatLabelType.Auto' />
                <SfNumericTextBox TValue="float" @bind-Value="@NewBookDto.Price" Placeholder="Price" FloatLabelType="FloatLabelType.Auto" />
                <SfDatePicker TValue="DateTime" @bind-Value="@NewBookDto.PublishDate" Placeholder='Publish Date' FloatLabelType="FloatLabelType.Auto" />
            </Content>
        </DialogTemplates>
        <DialogButtons>
            <DialogButton Content="Cancel" OnClick="@(e => { NewDialogOpen = false; })" />
            <DialogButton Content="Create" OnClick="@CreateBookAsync" IsPrimary="true" />
        </DialogButtons>
    </SfDialog>

    <SfDialog @bind-Visible="@EditingDialogOpen" Width="500px">
        <DialogTemplates>
            <Header>Edit book</Header>
            <Content>
                <SfTextBox @bind-Value="@EditingBookDto.Name" Placeholder='Book Name' FloatLabelType='FloatLabelType.Auto' />
                <SfNumericTextBox TValue="float" @bind-Value="@EditingBookDto.Price" Placeholder="Price" FloatLabelType="FloatLabelType.Auto" />
                <SfDatePicker TValue="DateTime" @bind-Value="@EditingBookDto.PublishDate" Placeholder='Publish Date' FloatLabelType="FloatLabelType.Auto" />
            </Content>
        </DialogTemplates>
        <DialogButtons>
            <DialogButton Content="Cancel" OnClick="@(e => { EditingDialogOpen = false; })" />
            <DialogButton Content="Update" OnClick="@UpdateBookAsync" IsPrimary="true" />
        </DialogButtons>
    </SfDialog>
}